/* Align Content */
.fr-content-center{align-content: center;}
.fr-content-start{align-content: flex-start;}
.fr-content-end{align-content: flex-end;}
.fr-content-between{align-content: space-between;}
.fr-content-around{align-content: space-around;}
.fr-content-stretch{align-content: stretch;}
/* Align Items */ 
.fr-items-stretch{align-items: stretch;}
.fr-items-start{align-items: flex-start;}
.fr-items-center{align-items: center;}
.fr-items-end{align-items: flex-end;}
/* Box-Sizing */ 
.fr-box-border{box-sizing: border-box}
.fr-box-content{box-sizing: content-box}
/* Display */
.fr-flex{display: flex;}
.fr-hidden{display: none;}
 /* Flex */
.fr-flex-none{flex: none;}
.fr-flex-auto{flex: auto;}
.fr-flex-0{flex: 0;}
.fr-flex-1{flex: 1;}
.fr-flex-2{flex: 2;}
.fr-flex-3{flex: 3;}
.fr-flex-4{flex: 4;}
.fr-flex-5{flex: 5;}
.fr-flex-6{flex: 6;}
.fr-flex-7{flex: 7;}
.fr-flex-8{flex: 8;}
.fr-flex-9{flex: 9;}
.fr-flex-10{flex: 10;}
.fr-flex-11{flex: 11;}
.fr-flex-12{flex: 12;}
/* Flex Direction */
.fr-row{flex-direction: row;}
.fr-column{flex-direction: column;}
.fr-row-reverse{flex-direction: row-reverse;}
.fr-column-reverse{flex-direction: column-reverse;}
/* Flex Grow */
.fr-grow{flex-grow: 1;}
.fr-grow-0{flex-grow: 0;}
.fr-grow-1{flex-grow: 1;}
.fr-grow-2{flex-grow: 2;}
.fr-grow-3{flex-grow: 3;}
.fr-grow-4{flex-grow: 4;}
.fr-grow-5{flex-grow: 5;}
.fr-grow-6{flex-grow: 6;}
.fr-grow-7{flex-grow: 7;}
.fr-grow-8{flex-grow: 8;}
.fr-grow-9{flex-grow: 9;}
.fr-grow-10{flex-grow: 10;}
.fr-grow-11{flex-grow: 11;}
.fr-grow-12{flex-grow: 12;}
/* Flex Wrap */
.fr-flex-nowrap{flex-wrap: nowrap;}
.fr-flex-wrap{flex-wrap: wrap;}
.fr-flex-wrap-reverse{flex-wrap: wrap-reverse;}
/* Justify Content */
.fr-justify-center{justify-content: center;}
.fr-justify-start{justify-content: flex-start;}
.fr-justify-end{justify-content: flex-end;}
.fr-justify-between{justify-content: space-between;}
.fr-justify-around{justify-content: space-around;}
.fr-justify-items{justify-content: center;align-items: center;}

/* Position */
.fr-relative{position: relative;}
.fr-absolute{position: absolute;}
.fr-fixed{position: fixed;}
/* #ifndef UNI-APP-X */
.fr-static{position: static;}
.fr-sticky{position: sticky;}
/* #endif */

/* z-index */
.fr-index--12{z-index: -12;}
.fr-index--11{z-index: -11;}
.fr-index--10{z-index: -10;}
.fr-index--9{z-index: -9;}
.fr-index--8{z-index: -8;}
.fr-index--7{z-index: -7;}
.fr-index--6{z-index: -6;}
.fr-index--5{z-index: -5;}
.fr-index--4{z-index: -4;}
.fr-index--3{z-index: -3;}
.fr-index--2{z-index: -2;}
.fr-index--1{z-index: -1;}
.fr-index-0{z-index: 0;}
.fr-index-1{z-index: 1;}
.fr-index-2{z-index: 2;}
.fr-index-3{z-index: 3;}
.fr-index-4{z-index: 4;}
.fr-index-5{z-index: 5;}
.fr-index-6{z-index: 6;}
.fr-index-7{z-index: 7;}
.fr-index-8{z-index: 8;}
.fr-index-9{z-index: 9;}
.fr-index-10{z-index: 10;}
.fr-index-11{z-index: 11;}
.fr-index-12{z-index: 12;}

.fr-index-990{z-index: 990;}
.fr-index-991{z-index: 991;}
.fr-index-992{z-index: 992;}
.fr-index-993{z-index: 993;}
.fr-index-994{z-index: 994;}
.fr-index-995{z-index: 995;}
.fr-index-996{z-index: 996;}
.fr-index-997{z-index: 997;}
.fr-index-998{z-index: 998;}
.fr-index-999{z-index: 999;}

/* visibility */
.fr-visible{visibility: visible;}
.fr-invisible{visibility: hidden;}

/* Opacity */
.fr-opacity-0{opacity: 0;}
.fr-opacity-0.05{opacity: 0.05;}
.fr-opacity-0.1{opacity: 0.1;}
.fr-opacity-0.15{opacity: 0.15;}
.fr-opacity-0.2{opacity: 0.2;}
.fr-opacity-0.25{opacity: 0.25;}
.fr-opacity-0.3{opacity: 0.3;}
.fr-opacity-0.35{opacity: 0.35;}
.fr-opacity-0.4{opacity: 0.4;}
.fr-opacity-0.45{opacity: 0.45;}
.fr-opacity-0.5{opacity: 0.5;}
.fr-opacity-0.55{opacity: 0.55;}
.fr-opacity-0.6{opacity: 0.6;}
.fr-opacity-0.65{opacity: 0.65;}
.fr-opacity-0.7{opacity: 0.7;}
.fr-opacity-0.75{opacity: 0.75;}
.fr-opacity-0.8{opacity: 0.8;}
.fr-opacity-0.85{opacity: 0.85;}
.fr-opacity-0.9{opacity: 0.9;}
.fr-opacity-0.95{opacity: 0.95;}
.fr-opacity-1{opacity: 1;}

/* Align Self */
.fr-self-auto{align-self: auto;}
.fr-self-start{align-self: flex-start;}
.fr-self-end{align-self: flex-end;}
.fr-self-center{align-self: center;}
.fr-self-stretch{align-self: stretch;}

/* 偏移 */
.fr-inset-full{top: 0rpx;right: 0rpx;bottom: 0rpx;left: 0rpx;}
.fr-inset-x{right: 0rpx;left: 0rpx;}
.fr-inset-y{top: 0rpx;bottom: 0rpx;}

@for $i from 0 to 188{
	.fr-top-#{$i * 2}{top: $i * 2 + rpx;}
	.fr-left-#{$i * 2}{left: $i * 2 + rpx;}
	.fr-bottom-#{$i * 2}{bottom: $i * 2 + rpx;}
	.fr-right-#{$i * 2}{right: $i * 2 + rpx;}
}

/* 图片 */
.fr-image-xs{width: $fr-image-size-xs;height: $fr-image-size-xs;}
.fr-image-sm{width: $fr-image-size-sm;height: $fr-image-size-sm;}
.fr-image-md{width: $fr-image-size-md;height: $fr-image-size-md;}
.fr-image-lg{width: $fr-image-size-lg;height: $fr-image-size-lg;}
.fr-image-xl{width: $fr-image-size-xl;height: $fr-image-size-xl;}